<!DOCTYPE html>
<html lang="en" xmlns:th:="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="jquery.js"></script>
<body>
<form action="/page" method="post" >
  图书名称:<input type="text" name="name" id="name" value="">
  图书类别:<input type="text" name="category" id="category" value="">
  图书作者:<input type="text" name="author" id="author" value="">
    <input type="submit" value="搜索">
    <input type="button" onclick="" value="添加新书">
    <table border="1px">
        <tr>
            <td>选择</td>
            <td>编号</td>
            <td>书名</td>
            <td>价格</td>
            <td>类目</td>
            <td>库存</td>
            <td>图片</td>
            <td>说明</td>
            <td>作者</td>
            <td>已售</td>
        </tr>
        <tr th:each="list:${page.records}">
            <td><input type="checkbox" name="ids" th:value="${list.id}" id="id" ></td>
            <td th:text="${list.id}"></td>
            <td th:text="${list.name}"></td>
            <td th:text="${list.price}"></td>
            <td th:text="${list.category}"></td>
            <td th:text="${list.pnum}"></td>
            <td th:text="${list.imgurl}"></td>
            <td th:text="${list.description}"></td>
            <td th:text="${list.author}"></td>
            <td th:text="${list.sales}"></td>
        </tr>
    </table>
    <input type="button" onclick="del(id.value)" value="删除所选">
</form>
总页数: <span th:text="${page.pages}"></span>
总记录数:<span th:text="${page.total}"></span>
当前页数:<span th:text="${page.current}"></span>
每页记录数:<span th:text="${page.size}"></span>
<span th:if="${page.current > 1}">
    <a th:href="@{/page(pageNum=${page.current -1})}">上一页</a>
</span>
<span th:each="p:${#numbers.sequence(1,page.pages)}">
    <a th:href="@{/page(pageNum=${p})}" th:text="${p}"></a>
</span>
<span th:if="${page.current < page.pages}">
    <a th:href="@{/page(pageNum=${page.current +1})}">下一页</a>
</span>

</body>
<script>
    function del(ids){
        console.log(ids)
        if($("input[name='ids']:checked").length == 0){
            alert("请选择要删除的项")
            return false;
        }

        if(confirm("确认删除吗?")){
            $.post("/del",{ids:ids},function (data){
                if(data){
                    location.href="/page"
                }else{
                    return false;
                }
            })
        }
    }
</script>
</html>